<template>

  <!--查询结果-->
  <div class="result-data">
    <div>
      <el-table :data="gridData">
        <el-table-column property="date" label="日期" width="150"></el-table-column>
        <el-table-column property="name" label="姓名" width="200"></el-table-column>
        <el-table-column property="address" label="地址"></el-table-column>
      </el-table>
    </div>
    <div>引用表格</div><button @click="search()">点击查询</button>
    <!--<comtable-->
               <!--:isLoading = "isLoading"-->
               <!--:tableTitle="tableTitle"-->
               <!--:funcBtn="funcBtn"-->
               <!--:resultData="resultData"-->
               <!--@queryData="queryPersons">-->
    <!--</comtable>-->
  </div>
</template>

<script>
  import comtable from '@/components/ComTable'
  import mockdata from '@/config/mockDemo'
  //这样的话组件里就可以随意调用接口了

    export default {
        name: "my-button4",
      component:{comtable:comtable},
      data() {
          return{
            isLoading: false,//是否显示加载图标
            funcBtn: [],//功能按钮数据
            tableTitle: [],//列表头部数据
            resultData: [],//列表数据
            gridData:[]
          }
      },
      created() {
        this.isLoading = true;
        this.tableTitle = [
          {title:'日期', prop:'date'},
          {title:'名字', prop:'name'},
          {title:'地址', prop:'address'},
        ]
      },
      mounted(){
        this.gridData = [{
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1517 弄'
        }, {
          date: '2016-05-01',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1519 弄'
        }, {
          date: '2016-05-03',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1516 弄'
        }]
        this.resultData = [{
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1517 弄'
        }, {
          date: '2016-05-01',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1519 弄'
        }, {
          date: '2016-05-03',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1516 弄'
        }]
        // this.queryPersons();// 初始化数据
      },
      methods:{
          //初始化数据
          //查询人员
        queryPersons(){
          this.resultData = [{
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄'
          }, {
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1517 弄'
          }, {
            date: '2016-05-01',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1519 弄'
          }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄'
          }]
        },
        search() {
          this.$http.post("/api/user").then(res => {
            console.log(res);
          });
          this.$http.post("/api/table").then(res => {
            console.log(res);
          });
        },
      }
    }
</script>

<style scoped>

</style>
